<template>
  <el-header height="70">
    <div class="logo">
      <img src="../../../static/images/logo.png"/>
    </div>
    <div class="userinfo">
      |<span><a href="javascript:;" @click="logout"><img src="../../../static/images/logout.png"/></a></span>
    </div>
    <el-dropdown class="userinfo" trigger="click" placement="top-end">
      <div class="avatar-wrapper">
        <img src="../../../static/images/user.png"/><span>{{username}}</span>
        <i class="el-icon-caret-bottom"></i>
      </div>
      <el-dropdown-menu class="avatar-dropdown" slot="dropdown">
        <el-dropdown-item><span @click="handleChange" style="display:block;">修改密码</span></el-dropdown-item>
      </el-dropdown-menu>
    </el-dropdown>
  </el-header>
</template>

<script>
import ajax from '@/utils/ajax'
export default {
  name: 'publicHeader',
  data() {
    return {
      username: ''
    }
  },
  created() {
    this.username = sessionStorage.getItem('username')
  },
  methods: {
    logout() {
      this.showLoginDialog = true
      const self = this
      ajax.getData(process.env.BASE_API + '/logout').then(function(res) {
        if (res.errCode === 0) {
          sessionStorage.clear()
          self.$router.push({ path: '/index' })
        }
      })
    },
    handleChange() {
      console.log('111')
    }
  }
}
</script>

